<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<button id="open">打开</button>
		<button id="close">关闭</button>
		<p id="msg" style="display: none;">我爱学习,我爱编程</p>
	</body>
</html>

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script type="text/javascript">
	
	const view = {
		init() {
			this.bindEvent();
		},
		
		bindEvent() {
			console.log('外面', this);
			$('#open').on('click', () => {
				// view.open();
				this.open();
			});
			
			// 使用箭头函数,this不会改变,绑定时是指向谁,执行的时候也指向谁
			$('#close').on('click', ()=> {
				console.log('里面', this);
				this.close();
			})
			
		},
		
		open() {
			$('#msg').show();
		},
		
		close() {
			$('#msg').hide();
		}
	}
	
	view.init();
</script>
